<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <!--[if lt IE 9]>
    <script type="text/javascript" src="/public/js/html5shiv.js"></script>
    <script type="text/javascript" src="/public/js/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/Hui-iconfont/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/css/style.css" />
    <!--[if IE 6]>
    <script type="text/javascript" src="/public/js/DD_belatedPNG_0.0.8a-min.js" ></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <title>权限设置</title>
</head>
<body>
<!--<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 系统管理 <span class="c-gray en">&gt;</span> 权限列表 <a class="btn btn-success radius refresh r" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>-->
<div class="page-container">
    <div class="cl">
        <form class="form form-horizontal" method="post" id="save-form">
            <div class="cl">
                角色名称：<?php echo isset($group['title'])?$group['title']:'' ?>
                <div class='skin-minimal r'><div class="check-box"><input type="checkbox" id="related" name="related"><label for="related">关联选择</label></div></div>
            </div>
            <div class="mt-10 cl">
                <table class="table table-border table-bordered table-bg" id="tbl_rules">
                    <?php
                    $access = isset($group['rules']) ? explode(',', $group['rules']) : array();
                    for ($row = 1; $row <= $rules['rows']; $row++)
                    {
                        echo '<tr>';
                        foreach ($rules['list'] as $v)
                        {
                            if ($v['row'] == $row)
                            {
                                $rowspan = $v['rowspan'] ? "rowspan='{$v['rowspan']}'" : '';
                                $colspan = $v['colspan'] ? "colspan='{$v['colspan']}'" : '';
                                echo "<td {$rowspan} {$colspan} class='skin-minimal'><div class=\"check-box\" title=\"{$v['name']}\"><input type=\"checkbox\" id=\"rule{$v['id']}\" name=\"group_id[]\" value=\"{$v['id']}\"" . (in_array($v['id'], $access) ? ' checked' : '') . "><label for=\"rule{$v['id']}\">{$v['title']}</label></div>";
                                if (isset($v['items']))
                                {
                                    foreach ($v['items'] as $item)
                                    {
                                        echo "<div class=\"check-box\" title=\"{$item['name']}\"><input type=\"checkbox\" id=\"rule{$item['id']}\" name=\"group_id[]\" value=\"{$item['id']}\"" . (in_array($item['id'], $access) ? ' checked' : '') . "><label for=\"rule{$item['id']}\">{$item['title']}</label></div>";
                                    }
                                }
                                echo '</td>';
                            }
                        }
                        echo '</tr>';
                    }
                    ?>
                </table>
            </div>
            <div class="mt-10 cl">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;保存&nbsp;&nbsp;">
                <a class="btn btn-white radius ml-20" id="close">&nbsp;&nbsp;关闭&nbsp;&nbsp;</a>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript" src="/public/js/jquery.min.js"></script>
<script type="text/javascript" src="/public/plugins/layer/layer.js"></script>
<script type="text/javascript" src="/public/plugins/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="/public/plugins/h-ui.admin/js/H-ui.admin.js"></script>
<script type="text/javascript">
    var index = parent.layer.getFrameIndex(window.name);
    $('input[type="submit"]').on('click', function () {
        return $.change_status({info: '设置角色权限失败', index: index, form: $('#save-form')});
    });
    $('.skin-minimal input').iCheck({
        checkboxClass: 'icheckbox-blue',
        radioClass: 'iradio-blue',
        increaseArea: '20%'
    });
    $('#close').on('click', function () {
        parent.layer.close(index);
        return false;
    });

    var target = '';
    $('input[name="group_id[]"]').on('ifClicked', function () {
        target = this.id;
    }).on('ifChanged', function () {
        if (target !== this.id || !$('#related').is(':checked')) return;

        var me = $(this), cur_td = me.closest('td'), cur_tr = me.closest('tr'), cur_cells = cur_tr.find('td');
        var cur_td_index = cur_td.index(), cur_tr_index = cur_tr.index(); //列索引、行索引
        var tbl = $('#tbl_rules'), rows = tbl.find('tr');
        var chk_sel = cur_td.find('input:checked'), chk_all = cur_td.find('input');
        var sel_one = chk_sel.length > 0, sel_all = chk_sel.length === chk_all.length;

        //查找子节点：存在多项，无需查找子节点；循环rowspan，第一行索引需要大于当前列索引
        function get_children(cur_td, cur_cells, cur_tr_index, cur_td_index, check_selected) {
            //console.log('~~', cur_td_index, cur_cells.length-1,cur_td_index === cur_cells.length - 1, cur_td)
            if (cur_td_index === cur_cells.length - 1) return false;
            var rowspan = parseInt(cur_td.attr('rowspan') || 1), is_selected = false;
            //console.log(rowspan)
            for (var i = 0; i < rowspan; i++) {
                rows.eq(cur_tr_index + i).find('input').each(function (j, n) {
                    if (i > 0 || j > cur_td_index) {
                        //console.log('@@', check_selected, $(n).is(':checked'))
                        if (!check_selected) {
                            $(n).iCheck(sel_all ? 'check' : 'uncheck');

                        } else if ($(n).is(':checked')) {
                            console.log('%%', $(n))
                            is_selected = true;
                            return false
                        }
                    }
                })
            }
            return is_selected;
        }

        get_children(cur_td, cur_cells, cur_tr_index, cur_td_index, false);

        //查找父节点：同一行递推，直至第一列；向上追溯，只有列数大于当前列的才算，小于直接停止，到达最大列数停止
        function select_parent() {
            for (var i = cur_td_index - 1; i >= 0; i--) {
                var sel_td = cur_cells.eq(i), rowspan = parseInt(sel_td.attr('rowspan') || 1);
                //console.log('--', sel_td, cur_cells)
                console.log(sel_td, rowspan);
                if (rowspan > 1) {
                    console.log(sel_one);
                    var is_sel = sel_one ? sel_one : get_children(sel_td, cur_cells, cur_tr_index, i, true);
                    console.log(is_sel);
                    sel_td.find('input').iCheck(is_sel ? 'check' : 'uncheck');
                } else {
                    console.log('##', sel_one);
                    sel_td.find('input').iCheck(sel_one ? 'check' : 'uncheck');
                }
            }
            var max_col = 3, cur_col = get_cell_colspan(cur_cells);
            console.log('$$', max_col, cur_col)
            if (cur_col >= max_col) return;
            for (var i = cur_tr_index - 1; i >= 0; i--) {
                var pre_cells = rows.eq(i).find('td'), pre_td = pre_cells.eq(0);
                var pre_col = get_cell_colspan(pre_cells);
                if (pre_col > cur_col) {
                    //console.log(sel_one)
                    var is_sel = sel_one ? sel_one : get_children(pre_td, pre_cells, i, 0, true);
                    rows.eq(i).find('td').eq(0).find('input').iCheck(is_sel ? 'check' : 'uncheck');
                }
                if (pre_col >= max_col) return;
            }
        }
        select_parent();

        function get_cell_colspan(obj) {
            var colspan = 0;
            obj.each(function (i, n) {
                colspan += parseInt($(n).attr('colspan') || 1);
            });
            return colspan;
        }
        target = '';
    })
</script>
</body>
</html>